<!DOCTYPE html>
<html lang="en">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0" />
  <title>Tusk - Refined Evernote desktop app</title>
  <link href="https://fonts.googleapis.com/css?family=Raleway:500" rel="stylesheet">
  <meta name="description" content="Refined Evernote desktop app">
  <meta name="author" content="Klaus Sinani">
  <meta name="robots" content="index,follow">
  <meta name="googlebot" content="index,follow">
  <script src="https://use.fontawesome.com/e95f01a005.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.1/css/materialize.min.css">
  <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
	<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
	<link rel="icon" type="image/png" sizes="96x96" href="favicon-96x96.png">
	<!-- Facebook Open Graph! -->
	<meta property="og:url" content="https://klaussinani.github.io/tusk">
	<meta property="og:type" content="website">
	<meta property="og:title" content="Tusk">
	<meta property="og:image" content="media/dark-theme.png">
	<meta property="og:description" content="Refined Evernote desktop app">
	<meta property="og:site_name" content="Tusk">
	<meta property="og:locale" content="en_US">
	<!-- Twitter Cards! -->
	<meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:site" content="@klaussinani">
	<meta name="twitter:creator" content="@klaussinani">
	<meta name="twitter:url" content="https://klaussinani.github.io/tusk">
	<meta name="twitter:title" content="Tusk">
	<meta name="twitter:description" content="Refined Evernote desktop app">
	<meta name="twitter:image" content="media/dark-theme.png">
	<!-- Google+ / Schema.org -->
	<meta itemprop="name" content="Tusk">
	<meta itemprop="description" content="Refined Evernote desktop app">
	<meta itemprop="image" content="media/dark-theme.png">
	<meta name="format-detection" content="telephone=no">
	<meta name="apple-mobile-web-app-status-bar-style" content="#FFFFFF">
	<meta name="apple-mobile-web-app-title" content="Tusk">
	<!-- App Icons!  -->
	<link rel="icon" sizes="192x192" href="highres-icon.png">
	<link rel="apple-touch-icon" href="apple-touch-icon.png">
	<meta name="theme-color" content="#FFFFFF">
	<meta name="mobile-web-app-capable" content="yes">
	<meta name="msapplication-tap-highlight" content="no">
	<meta name="application-name" content="Tusk">
	<meta name="msapplication-tooltip" content="Refined Evernote desktop app">
	<meta name="msapplication-navbutton-color" content="#FFFFFF">
	<meta name="msapplication-window" content="width=800;height=600">
	<meta name="msapplication-TileColor" content="#FFFFFF">
	<meta name="msapplication-TileImage" content="media/dark-theme.png">
	<meta name="msapplication-task-separator" content="1">
  <style>
    ::-webkit-scrollbar {
      width: 10px !important;
    }

    ::-webkit-scrollbar-track {
      border-radius: 0px !important;
    }

    ::-webkit-scrollbar-thumb {
      border-radius: 0px !important;
      background: #000000 !important;
    }

    html {
      font-family: 'Raleway', sans-serif;
    }

    hr {
      width: 30%;
    }

    .logo {
      padding-top: 30px !important;
    }

    .black-bg {
      background-color: #000000;
    }

    .white-text {
      color: #FFFFFF;
    }

    .card .card-image img {
      background-color: #000000;
      display: block;
      border-radius: 0px !important;
      position: relative;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      width: 100%;
    }

    .text-link {
      color: #000000;
      text-decoration: none;
      border-bottom: 1px black dotted;
    }

    .text-link:hover {
      border-bottom: 1px black solid;
    }

    .img-meta {
      display: block;
      margin: auto;
      padding-top: 0px;
    }

    .btn-spacing {
      margin: 3px;
    }

    .pad-bot {
      padding-bottom: 35px;
    }

    .beat {
      -webkit-animation: heartbeat 2000ms infinite;
      -moz-animation: heartbeat 2000ms infinite;
      -ms-animation: heartbeat 2000ms infinite;
      -o-animation: heartbeat 2000ms infinite;
      animation: heartbeat 2000ms infinite;
    }

    @-webkit-keyframes heartbeat {
      0%,
      40%,
      60%,
      80% {
        -webkit-transform: scale(1);
        transform: scale(1)
      }
      0%,
      40%,
      60%,
      80% {
        -webkit-transform: scale(1.25);
        transform: scale(1.25)
      }
    }

    @-moz-keyframes heartbeat {
      0%,
      40%,
      60%,
      80% {
        -webkit-transform: scale(1);
        transform: scale(1)
      }
      50%,
      70% {
        -webkit-transform: scale(1.25);
        transform: scale(1.25)
      }
    }

    @-ms-keyframes heartbeat {
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    50%,
    70% {
      -webkit-transform: scale(1.25);
      transform: scale(1.25)
    }

    -webkit-transform: scale(1);
    @-o-keyframes heartbeat {
      0%,
      40%,
      60%,
      80% {
        transform: scale(1)
      }

      50%,
      70% {
        -webkit-transform: scale(1.25);
        transform: scale(1.25)
      }
    }

    @keyframes heartbeat {
      0%,
      40%,
      60%,
      80% {
        -webkit-transform: scale(1);
        transform: scale(1)
      }

      50%,
      70% {
        -webkit-transform: scale(1.25);
        transform: scale(1.25)
      }
    }
  </style>
  <script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-105239476-1', 'auto');
  ga('send', 'pageview');

</script>
</head>

<body>
  <div class="section">
    <div class="container center">
      <img class="logo" src="media/logo.png" width="15%">
      <h3 class="header center">Tusk</h3>
      <div class="row center">
        <h5 class="col s12 light">Refined Evernote desktop app</h5>
      </div>
      <img class="img-meta" src="media/note-navigation.gif" width="100%">
      <div class="row center">
        <h6 class="col s12 light"><span id="gh-latest"></span></h6>
      </div>
      <div class="row center">
        <a href="https://github.com/klaussinani/tusk/releases/latest" class="btn-large waves-effect waves-light btn-spacing black"><i class="fa fa-download left"></i>Download</a>
        <a href="https://github.com/klaussinani/tusk" class="btn-large waves-effect waves-light btn-spacing black"><i class="fa fa-code-fork left"></i>Fork Source</a>
      </div>
    </div>
  </div>
  <div class="section">
    <div class="container">
      <br/>
      <br/>
      <br/>
      <h4 class="header center">What's inside?</h4>
      <hr/>
      <br/>
      <br/>
      <h4 class="header center">70+ Keyboard shortcuts</h4>
      <div class="row center">
        <h5 class="col s12 light">Toggle anything in a flash.</h5>
        <a class="text-link" href="https://github.com/klaussinani/tusk#keyboard-shortcuts">View all.</a>
      </div>
      <img class="img-meta" src="media/header.png" width="90%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Sepia Theme</h4>
      <div class="row center">
        <h5 class="col s12 light">Perfect for glossy screens.</h5>
      </div>
      <img class="img-meta" src="media/sepia-theme.png" width="90%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Dark Theme</h4>
      <div class="row center">
        <h5 class="col s12 light">Silky & relaxing.</h5>
      </div>
      <img class="img-meta" src="media/dark-theme.png" width="90%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Black Theme</h4>
      <div class="row center">
        <h5 class="col s12 light">Deep focus materialized.</h5>
      </div>
      <img class="img-meta" src="media/black-theme.png" width="90%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Focus Mode</h4>
      <div class="row center">
        <h5 class="col s12 light">Immerse yourself in a distraction-free note-taking mode.</h5>
      </div>
      <img class="img-meta" src="media/focus-mode.png" width="90%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Compact Mode</h4>
      <div class="row center">
        <h5 class="col s12 light">Keep your productivity to the maximum no matter the screen size.</h5>
      </div>
      <img class="img-meta" src="media/compact-mode.png" width="70%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Note Printing</h4>
      <div class="row center">
        <h5 class="col s12 light">Transfering your notes from screen to paper is only a keystroke away.</h5>
      </div>
      <img class="img-meta" src="media/print-note.gif" width="100%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Note Navigation</h4>
      <div class="row center">
        <h5 class="col s12 light">Navigate seamlessly without taking your hands away from the keyboard.</h5>
      </div>
      <img class="img-meta" src="media/note-navigation.gif" width="100%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Custom Shortcut Keys</h4>
      <div class="row center">
        <h5 class="col s12 light">Adjust Tusk to your workflow by modifying any shortcut key to your own preference.</h5>
      </div>
      <img class="img-meta" src="media/custom-shortcut-keys.gif" width="100%">
    </div>
  </div>
  <div class="section">
   <div class="container">
    <h4 class="header center">Export Notes</h4>
    <div class="row center">
      <h5 class="col s12 light">Export and save your notes effortlessly on your machine as `pdf` files.</h5>
    </div>
    <img class="img-meta" src="media/export-notes.gif" width="100%">
  </div>
</div>
<div class="section">
  <div class="section">
    <div class="container">
      <h4 class="header center">Yinxiang Support</h4>
      <div class="row center">
        <h5 class="col s12 light">One-click login to your Yinxiang account.</h5>
      </div>
      <img class="img-meta" src="media/yinxiang-support.png" width="100%">
    </div>
  </div>
</div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Scalable Interface</h4>
      <div class="row center">
        <h5 class="col s12 light">Adjust the zooming factor to your own preference.</h5>
      </div>
      <img class="img-meta" src="media/scalable-interface.gif" width="100%">
    </div>
  </div>
  <div class="section">
    <div class="container">
      <h4 class="header center">Cross Platform, Update Notifications & more</h4>
      <div class="row center">
        <h5 class="col s12">View all the features in detail on <a href="https://github.com/klaussinani/tusk" class="text-link">Github.</a></h5>
      </div>
      <br/>
    </div>
  </div>
  <footer class="pad-bot">
    <div class="container ">
      <div class="row center">
        <h6 class="col s12 light"><i class="fa fa-code fa-lg"></i> with <i class="fa fa-heart fa-lg beat"></i> by
          <a href="https://github.com/klaussinani" class="text-link">@klaussinani</a>
        </h6>
        <h6 class="col s12 light">Tusk is an unofficial, open source, third-party, community driven, free app and is not affiliated in any way with Evernote.</h6>
      </div>
    </div>
  </footer>
  <script>
    var xmlhttp = new XMLHttpRequest();
    var repoMetaURL = "https://api.github.com/repos/klaussinani/tusk/commits/master";
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        var repoMeta = JSON.parse(this.responseText);

        var commitURL = repoMeta.html_url;
        var authorURL = repoMeta.author.html_url;
        var commitMessage = repoMeta.commit.message;
        var authorName = repoMeta.commit.author.name;
        var commitDate = new Date(repoMeta.commit.author.date).toDateString();

        var ghLatestActivity = 'Latest commit on Github: "' + '<a class="text-link" href="' + commitURL + '"' + '>' + commitMessage + '</a>' + '" by ' + '<a class="text-link" href="' + authorURL + '"' + '>' + authorName + '</a>' + ' on ' + commitDate + '.';

        document.getElementById("gh-latest").innerHTML = ghLatestActivity;
      }
    };
    xmlhttp.open("GET", repoMetaURL, true);
    xmlhttp.send();
  </script>
</body>

</html>
